@extends("base.base")
@include('Commodity.header')
@section("main")
    <style>
        .main {
            background: #ffffff;
            min-height: 92vh;
        }

        .balance {
            font-size: 3rem;
            height: 30vh;
            line-height: 30vh;
            color: #ba3b3f;
            background: #ffffff;
            border-bottom: 0.3rem solid #f4f4f4;
        }

        .recharge {
            height: 30vh;
            padding-top: 5vh;
            background: #ffffff;
            font-size: 3rem;
        }

        .cart-footer {
            position: fixed;
            bottom: 0;
            left: 0;
            height: 10vh;
            width: 100vw;
            background: #ffffff;
            border-top: 1px solid #dfdfdf;
            border-bottom: 1px solid #dfdfdf;
        }

        .cart-footer div {
            display: inline-block;
            float: left;
        }

        .cft-left {
            width: 70%;
            height: 10vh;
            font-size: 1.6rem;
            line-height: 10vh;
            color: #ba3b3f;
        }

        .cft-right {
            width: 30%;
            height: 10vh;
            line-height: 10vh;
            font-size: 1.6rem;
            color: #ffffff;
            background: #b4282d;
        }
    </style>
    <main id="main" class="main">
        <div id="balance" class="balance">
            应支付: ¥<span class="cft-price">{{number_format($parent_order["all_price"],2)}}</span>
        </div>
        <div id="recharge" class="recharge">
            您的余额: ¥{{number_format($balance,2)}}
        </div>
    </main>
    <div id="cart-footer" class="cart-footer">
        <div class="cft-left">
            <span class="cft-close">关闭订单</span>
        </div>
        <div class="cft-right">
            <span class="sure">确认</span>
        </div>
    </div>
    <script>
        var order = {{$parent_order["parent_order_id"]}};
        $(".cft-right").on("click", function () {
            if (!order)
                return false
            loading.show()

            $.post(
                "/api/pay_order",
                {
                    _token: csrf_token,
                    price: $(".cft-price").text(),
                    order: order,
                },
                function (e) {
                    if (e.errorCode == 100) {
                        alert(e.errorMsg);
                        window.location.href = "/user/balance"
                    } else if (e.errorCode == 0) {
                        alert(e.errorMsg);
                        window.location.href = "/user"
                    } else {
                        alert(e.errorMsg);
                        window.location.reload();
                    }
                    loading.hide()
                }, "json")
        })
        $(".cft-left").on("click", function () {
            if (!order)
                return false
            loading.show()
            $.post(
                "/api/cancel_order",
                {
                    _token: csrf_token,
                    order: order,
                },
                function (e) {
                    if (e.errorCode == 100) {
                        alert(e.errorMsg);
                        window.location.href = "/user/balance"
                    } else if (e.errorCode == 0) {
                        window.location.href = "/order/pay/" + e.data.parent_order_id
                    } else {
                        alert(e.errorMsg);
                        window.location.href = "/user/order/list"
                    }
                    loading.hide()
                }, "json")
        })
    </script>
@endsection